$primaryColor: #cc6688;
$primaryLighter: lighten($primaryColor, 5%);
$primaryLighter2: lighten($primaryColor, 50%);
$primaryBorder: #cc6688;
$primaryBackgroundColor: white;

$primaryColorDark: #cb6587;
$primaryLighterDark: lighten($primaryColorDark, 5%);
$primaryLighter2Dark: lighten($primaryColorDark, 50%);
$primaryBorderDark: #cb6587;
$primaryBackgroundColorDark: #333333;

@media (prefers-color-scheme: dark) {
    button {
        background-color: $primaryColorDark;
        color: $primaryLighter2;
        border: solid 1px $primaryBorderDark;
    }

    select,
    input,
    textarea {
        background-color: $primaryBackgroundColorDark;
        color: $primaryLighter2;
        border: solid 1px $primaryBorderDark;
    }
}
